<template>
  <div class="page-card page-card-form qy">
    <h1 style="text-align: center">重点企业数据详情</h1>
    <!-- <div class="back">
      <a-button type="default" @click="$router.go(-1)"><a-icon type="left" /> 返 回</a-button>
    </div>
    <br> -->
    <a-form-model
      :class="[`form-${type}`]"
      ref="ruleForm"
      labelAlign="right"
      :model="form"
      :labelCol="{span: 6 }"
      :wrapperCol="{span: 18}"
      :rules="rules"
      size="large">
      <a-row :gutter="24">
        <a-col :span="24">
          <a-form-model-item label="企业ID" :labelCol="{span: 3 }" :wrapperCol="{span: 21}" :prop="type == 'detail' ? '':'enterpriseId'">
            <a-input
              :class="[`forminput-${type}`]"
              style="width: 100%"
              :maxLength="50"
              size="large"
              v-model="form.enterpriseId"
              placeholder="请输入企业ID"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="是否已申报" :prop="type == 'detail' ? '':'status'">
            <a-select :class="[`forminput-${type}`]" v-model="form.status" style="width: 100%" placeholder="请选择">
              <a-select-option :value="0">否</a-select-option>
              <a-select-option :value="1">是</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="是否通过" :prop="type == 'detail' ? '':'passStatus'">
            <a-select :class="[`forminput-${type}`]" v-model="form.passStatus" style="width: 100%" placeholder="请选择">
              <a-select-option :value="0">否</a-select-option>
              <a-select-option :value="1">是</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="企业名称" :prop="type == 'detail' ? '':'qymc'">
            <a-input
              :class="[`forminput-${type}`]"
              style="width: 100%"
              :maxLength="50"
              size="large"
              v-model="form.qymc"
              placeholder="请输入企业名称"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="统一社会信用代码" :prop="type == 'detail' ? '':'tyshxydm'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.tyshxydm" placeholder="请输入统一社会信用代码"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item label="企业简介" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.qyjc"
              placeholder="请输入企业简介"></a-textarea>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="研发人数" :prop="type == 'detail' ? '':'yfrs'">
            <span v-if="type == 'detail'">{{ form.yfrs }} 人</span>
            <a-input
              v-else
              suffix="人"
              :class="[`forminput-${type}`]"
              style="width: 100%"
              size="large"
              v-model="form.yfrs"
              placeholder="请输入研发人数"></a-input>

          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="法人代表" :prop="type == 'detail' ? '':'frdb'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.frdb" placeholder="请输入法人代表"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="注册资本" :prop="type == 'detail' ? '':'zczb'">
            <span v-if="type == 'detail'">{{ form.zczb }} 万元</span>
            <a-input
              v-else
              suffix="万元"
              :class="[`forminput-${type}`]"
              style="width: 100%"
              size="large"
              v-model="form.zczb"
              placeholder="请输入注册资本"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="成立日期" :prop="type == 'detail' ? '':'clrq'">
            <a-date-picker
              :class="[`forminput-${type}`]"
              size="large"
              style="width: 100%"
              v-model="form.clrq"
              format="YYYY-MM-DD HH:mm:ss"
              :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
              @change="(e, time) => form.clrq = moment(time).format('YYYY-MM-DD HH:mm:ss')"
            />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="参保人数" :prop="type == 'detail' ? '':'cbrs'">
            <span v-if="type == 'detail'">{{ form.cbrs }} 人</span>
            <a-input
              v-else
              suffix="人"
              :class="[`forminput-${type}`]"
              style="width: 100%"
              size="large"
              v-model="form.cbrs"
              placeholder="请输入参保人数"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="所属行业" :prop="type == 'detail' ? '':'sshy'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.sshy" placeholder="请输入所属行业"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="24">
          <a-form-model-item label="企业背景" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.qybj"
              placeholder="请输入企业背景"></a-textarea>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="企业状态" :prop="type == 'detail' ? '':'qyzt'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.qyzt" placeholder="请输入企业状态"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="注册地址" :prop="type == 'detail' ? '':'zcdz'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.zcdz" placeholder="请输入注册地址"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="实际控股人" :prop="type == 'detail' ? '':'sjkzr'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.sjkzr" placeholder="请输入实际控股人"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="详细地址" :prop="type == 'detail' ? '':'xxdz'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.xxdz" placeholder="请输入详细地址"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="营业总收入" :prop="type == 'detail' ? '':'yyzsr'">
            <span v-if="type == 'detail'">{{ form.yyzsr }} 万元</span>
            <a-input
              v-else
              suffix="万元"
              :class="[`forminput-${type}`]"
              style="width: 100%"
              size="large"
              v-model="form.yyzsr"
              placeholder="请输入营业总收入"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="研发投入费用" :prop="type == 'detail' ? '':'yftrfy'">
            <span v-if="type == 'detail'">{{ form.yftrfy }} 万元</span>
            <a-input
              v-else
              suffix="万元"
              :class="[`forminput-${type}`]"
              style="width: 100%"
              size="large"
              v-model="form.yftrfy"
              placeholder="请输入研发投入费用"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="资产总额" :prop="type == 'detail' ? '':'zcze'">
            <span v-if="type == 'detail'">{{ form.zcze }} 万元</span>
            <a-input
              v-else
              suffix="万元"
              :class="[`forminput-${type}`]"
              style="width: 100%"
              size="large"
              v-model="form.zcze"
              placeholder="请输入资产总额"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="官方网站" :prop="type == 'detail' ? '':'gfwz'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.gfwz" placeholder="请输入官方网站"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="股东信息" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.gdxx"
              placeholder="请输入股东信息"></a-textarea>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="主营业务信息" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.zyywxx"
              placeholder="请输入主营业务信息"></a-textarea>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="上市信息" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.ssxx"
              placeholder="请输入上市信息"></a-textarea>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="企业微信公众号" :prop="type == 'detail' ? '':'qywxgzh'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.qywxgzh" placeholder="请输入企业微信公众号"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="企业报送联系人" :prop="type == 'detail' ? '':'qybslxr'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.qybslxr" placeholder="请输入企业报送联系人"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="主要产品" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.zycp"
              placeholder="请输入主要产品"></a-textarea>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="主要服务" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.zyfw"
              placeholder="请输入主要服务"></a-textarea>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="互联网平台" :prop="type == 'detail' ? '':'hlwpt'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.hlwpt" placeholder="请输入互联网平台"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="app平台" :prop="type == 'detail' ? '':'apppt'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.apppt" placeholder="请输入app平台"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="核心技术" :prop="type == 'detail' ? '':'hxjs'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.hxjs" placeholder="请输入核心技术"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="专利数量" :prop="type == 'detail' ? '':'zlsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.zlsl" placeholder="请输入专利数量"></a-input-number>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="商标数量" :prop="type == 'detail' ? '':'sbsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.sbsl" placeholder="请输入商标数量"></a-input-number>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="软件著作权数量" :prop="type == 'detail' ? '':'rjzzqsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.rjzzqsl" placeholder="请输入软件著作权数量"></a-input-number>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="作品著作权数量" :prop="type == 'detail' ? '':'zpzzqsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.zpzzqsl" placeholder="请输入作品著作权数量"></a-input-number>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="国家标准数量" :prop="type == 'detail' ? '':'gjbzsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.gjbzsl" placeholder="请输入国家标准数量"></a-input-number>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="国际标准数量" :prop="type == 'detail' ? '':'gjibzsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.gjibzsl" placeholder="请输入国际标准数量"></a-input-number>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="团体标准数量" :prop="type == 'detail' ? '':'ttbzsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.ttbzsl" placeholder="请输入团体标准数量"></a-input-number>
          </a-form-model-item>
        </a-col>

        <a-col :span="12">
          <a-form-model-item label="行业标准数量" :prop="type == 'detail' ? '':'hybzsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.hybzsl" placeholder="请输入行业标准数量"></a-input-number>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="其他标准数量" :prop="type == 'detail' ? '':'qtbzsl'">
            <a-input-number :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.qtbzsl" placeholder="请输入其他标准数量"></a-input-number>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="获奖信息" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.hjxx"
              placeholder="请输入获奖信息"></a-textarea>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="行业地位信息" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea
              :class="[`forminput-${type}`]"
              :rows="5"
              style="width: 100%"
              size="large"
              v-model="form.hydwxx"
              placeholder="请输入行业地位信息"></a-textarea>
          </a-form-model-item>
        </a-col>
        <a-col :span="24" v-if="type == 'detail'">
          <a-form-model-item label="审核状态" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <span class="green" v-if="form.examine == 1">已通过</span>
            <span class="red" v-else-if="form.examine == 2">未通过</span>
            <span v-else>未审核</span>
          </a-form-model-item>
        </a-col>

        <!-- <a-col :span="12">
          <a-form-model-item label="所在地" :prop="type == 'detail' ? '':'location'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.location" placeholder="请输入所在地"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="经营范围" :prop="type == 'detail' ? '':'nature'">
            <a-input :class="[`forminput-${type}`]" style="width: 100%" size="large" v-model="form.nature" placeholder="请输入经营范围"></a-input>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="备注" :labelCol="{span: 3 }" :wrapperCol="{span: 21}">
            <a-textarea :class="[`forminput-${type}`]" :rows="5" style="width: 100%" size="large" v-model="form.remark" placeholder="请输入备注"></a-textarea>
          </a-form-model-item>
        </a-col> -->
        <!-- <a-col :span="12">
          <a-form-model-item label=" " :colon="false" v-if="type == 'detail' && (form.examine == 0 || form.examine == 2)">
            <a-space size="large">
              <a-button type="success" style="background: #1CAA59;color: #fff" @click="updateEnforcementExamine(1)">审核通过</a-button>
              <a-button type="danger" @click="updateEnforcementExamine(2)">审核拒绝</a-button>
              <a-button type="default" @click="$router.go(-1)">取 消</a-button>
            </a-space>
          </a-form-model-item>
          <a-form-model-item label=" " :colon="false" v-else-if="type != 'detail'">
            <a-space size="large">
              <a-button type="primary" @click="submit">确 认</a-button>
              <a-button type="default" @click="$router.go(-1)">取 消</a-button>
            </a-space>
          </a-form-model-item>
        </a-col> -->
      </a-row>

    </a-form-model>
  </div>
</template>

<script>
import moment from 'moment';
// eslint-disable-next-line
import { addStressEnterprises, editStressEnterprises, getStressEnterprisesDetail, updateStressEnterprisesExamine } from '@/api/db';
// import cloneDeep from 'lodash/cloneDeep';
import { mapState } from 'vuex';

export default {
  props: {
    showModal: {
      type: Boolean,
      default: false
    }
  },
  model: {
    prop: 'showModal',
    event: 'update:showModal'
  },
  watch: {
    showModal: {
      handler(val) {
        this.show = val;
        if (val) {
          // detailAccount().then(res => {
          //   this.form = res.data || {};
          //   this.$set(this.form, 'isLayered', !!this.form.isLayered);
          // });
        }
      },
      immediate: true
    },
    show(val) {
      this.$emit('update:showModal', val);
    }
  },
  data() {
    return {
      moment,
      show: false,
      form: {},
      type: 'add',
      rules: {
        enterpriseId: [{ required: true, message: '请输入' }],
        status: [{ required: true, message: '请选择' }],
        passStatus: [{ required: true, message: '请选择' }],
        qymc: [{ required: true, message: '请输入' }],
        tyshxydm: [{ required: true, message: '请输入' }],
        frdb: [{ required: true, message: '请输入' }],
        zczb: [{ required: true, message: '请输入' }],
        clrq: [{ required: true, message: '请输入' }]
      }
    };
  },
  computed: {
    ...mapState({
      // dbType: state => state.user.dbType
    })
  },
  created() {
    const { id, type } = this.$route.query;
    if (id) {
      this.form.id = id;
      this.type = 'edit';
      this.getDetail();
    }
    if (type == 'detail') {
      this.type = 'detail';
    }
  },
  methods: {
    getDetail() {
      getStressEnterprisesDetail({ id: this.form.id }).then(res => {
        this.form = res.data;
      });
    },
    add() {
      // const that = this;
      this.type = 'add';
      this.$nextTick(() => {
        this.form = {};
        this.$refs.ruleForm && this.$refs.ruleForm.resetFields();
      });
    },
    edit(form) {
      this.type = 'edit';
      this.form = { ...this.form, ...form };
    },
    submit() {
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          if (this.type == 'add') {
            addStressEnterprises(this.form).then(res => {
              this.$message.success('创建成功');
              this.$router.go(-1);
            });
          } else if (this.type == 'edit') {
            editStressEnterprises(this.form).then(res => {
              this.$message.success('编辑成功');
              this.$router.go(-1);
            });
          }
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    updateEnforcementExamine(examine) {
      const that = this;
      this.$confirm({
        content: `确定要审核${examine == 1 ? '通过' : '不通过'}吗？`,
        onOk() {
          updateStressEnterprisesExamine({
            id: that.form.id,
            examine
          }).then(res => {
            that.$message.success('审核完成！');
            that.$router.go(-1);
          });
        }
      });
    }
  }
};
</script>

<style lang="less">
.qy {
  h1 {
    font-size: 24px;
  }
  .forminput-detail {
    width: auto !important;
  }
  .form-detail {
    .ant-col-21,.ant-col-18 {
      // margin-left: -38px;
    }
  }
}
.forminput-detail {
  border: none !important;
  pointer-events: none;
  .ant-select-arrow {
    display: none !important;
  }
  .ant-select-selection {
    border: none;
  }
  i {
    display: none;
  }
  .ant-input {
    border: none;
  }
}
textarea.forminput-detail {
    margin-top: 6px !important;
    min-width: 100% !important;
}
</style>
